.icon-layout {
  &-wrap {
    width: 100rpx;
    height: 64rpx;
    padding: 4rpx;
    border: 2rpx solid rgba(229, 230, 236, 1);
    border-radius: 8rpx;
    background: #fff;

    .layout-border {
      border: 1rpx solid #c9cdd5;
    }

    .layout-mb {
      margin-bottom: 4rpx;
    }


    .width-1 {
      width: 100%;
      height: 100%;
    }

    .width-2 {
      width: 44rpx;
      height: 26rpx;
    }

    .width-3 {
      width: 42rpx;
      height: 100%;
    }

    .width-4 {
      width: 42rpx;
      height: 24rpx;
    }

    .width-5 {
      width: 42rpx;
      height: 18rpx;
    }

    .width-6 {
      width: 42rpx;
      height: 30rpx;
    }

    .width-7 {
      width: 42rpx;
      height: 10rpx;
    }
  }

  &-inner {
    background: #e5e6ea;
    border-radius: 4rpx;
  }

  &-selected {
    border-color: #93beff;
    background: #e8f3ff;

    .icon-layout-inner {
      background: #176bfb;
    }

    .layout-border {
      border-color: #fff;
    }
  }
}

view.status-dot{
  width: 12rpx;
  height: 12rpx;
  border-radius: 100%;
}
